<%-- 
    Document   : resetpassword02
    Created on : 03-Aug-2013, 12:53:22
    Author     : Minh Quyen
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Reset Password | Lafitte</title>
        <link rel="shortcut icon" href="./images2/logo.jpg">

        <!-- Style -->
        <style type="text/css" media="screen">
            #captcha
            {
                height:38px;
                background-image:url(captcha.gif);
                background-repeat:no-repeat;
                font-size:25px;
                position:relative;
            }
            #captcha_gen
            {
                left:10px;
                top:3px;
                position:absolute;
                Font-family:Monospace;
                font-weight:bold;
                text-align:justify;
            }
            body{
                background-image: url(images2/Untitled.jpg);
                background-repeat: no-repeat;
                background-color: black;
            }
            .container[role="main"] {
                padding-bottom: 60px;
            }
            .bottombar {
                position: fixed;
                bottom: 0;
                left: 0;
                right: 0;
            }
        </style>
        <!-- Style -->
        <!-- Java Script -->
        <script language="javascript" type="text/javascript">
            function getCaptcha() {
                var chars = "0Aa1Bb2Cc3Dd4Ee5Ff6Gg7Hh8Ii9Jj0Kk1Ll2Mm3Nn4Oo5Pp6Qq7Rr8Ss9Tt0Uu1Vv2Ww3Xx4Yy5Zz";
                var string_length = 5;
                var captchastring = '';
                for (var i=0; i<string_length; i++) {
                    var rnum = Math.floor(Math.random() * chars.length);
                    captchastring += chars.substring(rnum,rnum+1);
                }
                document.getElementById("randomfield").innerHTML = captchastring;
            }
            function myFunction(code)
            {
                x=document.getElementById("randomfield");
                y=code.value;
                var z;
                z=(x.innerHTML==y)?'Correct':'Incorrect';
                document.getElementById("alert").innerHTML=z;
                document.getElementById("alertT").value=z;
            }

            function validateEmail(emailField){
                var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;

                if(emailField.value.length==0){
                    document.getElementById("emailError").innerHTML='Email is required!';
                    return false;
                }else if (reg.test(emailField.value) == false)
                {
                    document.getElementById("emailError").innerHTML='Invalid email!';
                    return false;
                }

                document.getElementById("emailError").innerHTML='';
                return true;

            }
        </script>
        <!-- Java Script -->
    </head>
    <body onload="getCaptcha();">
        <div class="container-fluid">
            <div class="row-fluid">
                <div class="span4"></div>
                <div class="span6" align="center">
                    <jsp:include page="menubar.jsp" flush=""/>
                    <h2><font color="white">Reset password</font></h2>
                    <form action="Controller" method="POST">
                        <table>
                            <tr>
                                <td><font color="white">Email:<span style="color: red">*</span></font></td>
                                <td><input type="text" name="txtEmail" value="${param.txtEmail}" onblur="validateEmail(this);"/></td>
                                <td><label style="color: red" id="emailError">
                                        <c:if test="${not empty MESSEMAIL}">
                                            ${MESSEMAIL}
                                        </c:if>
                                    </label></td>
                            </tr>
                            <tr>
                                <td style="color: white"><b>Please enter following verification code:<span style="color: red">*</span></b></td>
                                <td><input type="text" value="" onkeyup="myFunction(this);" name="txtVer"/></td>
                                <td>
                                    <label style="color: red" id="alert">
                                        <c:if test="${not empty MESSVER}">
                                            ${MESSVER}
                                        </c:if>
                                    </label>
                                </td>
                            </tr>
                            <tr>
                                <td></td>
                                <td colspan="">
                                    <div id="captcha">
                                        <div id="captcha_gen">
                                            <div class="row-fluid">
                                                <div class="span8">
                                                    <label align="center" id="randomfield" style="color: red" class="alert-info" >
                                                    </label>
                                                </div>
                                                <div class="span2">
                                                    <a href="" class="btn btn-inverse"><i class="icon-refresh icon-white" onclick="getCaptcha()"></i></a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            <tr>
                                <td></td>
                                <td></td>
                                <td align="right"><input type="submit" value="Get password" name="btAction" class="btn btn-inverse"/> </td>
                            </tr>
                        </table>
                    </form>
                </div>
            </div>
        </div>
        <div class="bottombar">
            <div class="bottom-inner">
                <div class="container">
                    <jsp:include page="footer.jsp" flush="" />
                </div>
            </div>
        </div>
    </body>
</html>
